<template>
  <a-select
    style="width: 100%"
    :class="[detailed ? 'stb-select-detailed' : '']"
    :allowClear="allowClear"
    :disabled="disabled"
    :value="value"
    :placeholder="placeholder"
    @blur="handleBlur"
    @change="handleChange">
    <a-select-option
      v-for="item in YEAR_LIST"
      :key="item.id"
      :value="item.code">
      {{ item.name }}
    </a-select-option>
  </a-select>
</template>

<script>
import { getYearList } from "@/api/constant"

// 通用下拉数据信息
export default {
  name: "StbDebtSelect",
  computed: {
    // 立项年度
    YEAR_LIST() { 
      return getYearList(-1, 30) 
    },
  },
  model: {
    prop: "defaultValue",
    event: "change"
  },
  props: {
    defaultValue: {
      type: [String, Array, Number],
      required: false,
    },
    disabled: {
      type: Boolean,
      default: false
    },
    detailed: {
      type: Boolean,
      default: false
    },
    // 是否进行转换
    stringConvert: {
      type: Boolean,
      default: true
    },
    placeholder: {
      type: String,
      default: "请选择年度",
      required: false
    },
    allowClear: {
      type: Boolean,
      default: false,
    }
  },
  watch: {
    defaultValue: {
      deep: true,
      immediate: true,
      handler (val, oldVal) {
        if (typeof val === "string" && this.stringConvert) {
          val = Number(val)
        }
        this.value = val
      }
    },
  },
  data () {
    return {
      value: undefined,
      yearDataSource: [],
    }
  },
  methods: {
    handleBlur (value, option) {
      this.$emit("blur", value, option)
    },
    handleChange (value, option) {
      this.value = value
      this.$emit("change", value, option)
    }
  }
}
</script>

